html,
body {
  width: 100%;
  height: 100%;
}
:root {
  --bgImg: url(../images/normal-bg.png);
}
#app {
  position: relative;
  width: 100%;
  height: 100%;
  background: url(../images/normal-bg.png);
  background: var(--bgImg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#app .login-box {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 960px;
  height: 588px;
  box-shadow: 0px 3px 7px 0px rgba(0, 87, 136, 0.35);
  border-radius: 4px;
  background: url(../images/login_bg.png) no-repeat center center;
  background-size: 100%;
}
#app .login-wrap {
  width: 480px;
  background: transparent;
  margin-top: 60px;
}
#app .login-wrap .tip {
  width: 142px;
  height: 34px;
  font-size: 28px;
  font-family: SourceHanSansCN;
  font-weight: 400;
  color: #909399;
  margin: 0 auto;
  margin-top: 48px;
  text-align: center;
  letter-spacing: 4px;
}
#app .login-wrap .title {
  width: 366px;
  line-height: 40px;
  font-size: 36px;
  font-family: SourceHanSansCN;
  font-weight: 500;
  color: #169AFF;
  margin: 0 auto;
  margin-top: 20px;
  text-align: center;
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
#app .login-wrap .title .img {
  max-width: 100%;
  max-height: 100%;
}
#app .login-wrap .content {
  width: 366px;
  margin: 0 auto;
  margin-top: 58px;
  position: relative;
}
#app .login-wrap .content .msg-b {
  position: absolute;
  left: 0;
  /* top: -28px; */
  bottom: 100%;
  width: 100%;
  /* height: 30px; */
  /* line-height: 30px; */
  padding: 4px 8px;
  background-color: #fdf6ec;
  /* border-color: #faecd8; */
  color: #e6a23c;
  font-size: 14px;
}
#app .login-wrap .content .msg-b .el-icon-warning {
  margin-right: 5px;
  vertical-align: middle;
}
#app .login-wrap .content .el-form {
  margin-bottom: 48px;
}
#app .login-wrap .content .el-form .el-form-item {
  margin-bottom: 28px;
}
#app .login-wrap .content .el-form .el-form-item:last-of-type {
  margin-bottom: 10px;
}
#app .login-wrap .content .el-form .el-input .el-input__inner {
  height: 50px;
  line-height: 50px;
  color: #575962;
  font-size: 18px;
  padding-left: 50px !important;
}
#app .login-wrap .content .el-form .el-input .el-input__inner:-webkit-autofill {
  -webkit-text-fill-color: #575962 !important;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  background-color: transparent;
  background-image: none;
  transition: background-color 50000s ease-in-out 0s;
  /*背景色透明  生效时长  过渡效果  启用时延迟的时间*/
}
#app .login-wrap .content .el-form .el-input .el-input__prefix {
  line-height: 50px;
  left: 15px;
}
#app .login-wrap .content .el-form .el-input .el-input-group__append {
  width: 128px;
  height: 50px;
  cursor: pointer;
  padding: 0 !important;
}
#app .login-wrap .content .el-form .el-input .inp-icon {
  display: inline-block;
  vertical-align: middle;
  height: 24px;
  width: 24px;
  background: url('../images/icon_user.png') no-repeat center;
  background-size: 100% 100%;
}
#app .login-wrap .content .el-form .el-input .icon-pwd {
  height: 21px;
  background: url('../images/icon_pwd.png') no-repeat center;
  background-size: 100% 100%;
}
#app .login-wrap .content .el-form .el-input .icon-code {
  background: url('../images/icon_code.png') no-repeat center;
  background-size: 100% 100%;
}
#app .login-wrap .content .el-form .el-input .code-image {
  width: 100%;
  height: 100%;
}
#app .login-wrap .content .el-form .forget-pwd {
  display: block;
  text-align: right;
  color: #909399;
  font-size: 14px;
  margin-bottom: 36px;
  width: 60px;
  margin-left: calc(100% - 60px);
}
#app .login-wrap .content .el-form .forget-pwd:hover {
  color: #3699FF;
}
#app .login-wrap .content .lg-btn {
  width: 366px;
  height: 50px;
  background: #169AFF;
  border-radius: 2px;
  font-weight: 400;
  color: #FFFFFF;
  font-size: 18px;
}
#app .page-footer {
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  font-size: 14px;
  color: #575962;
  text-align: center;
}
/* 新密码等级 */
.pwd-strength-box .level-box {
  display: inline-block;
  vertical-align: middle;
  width: 44px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  text-align: center;
  background: #eeeeee;
}
.el-dialog__headerbtn {
  top: 12px;
}
